<template>
    <h1> Api Test Vue</h1>
    <div>
        <ul>
            <li>
                <span>banner</span>
                <p>{{bannerRepRef}}</p>
            </li>
            <li>
                <span>/api/blog  get</span>
                <p>{{blogRepRef}}</p>
            </li>
            <li>
                <span>/api/blogtype  get</span>
                <p>{{blogCategoriesRef}}</p>
            </li>
        </ul>
    </div>
</template>
<script setup lang='ts'>
import { onMounted, ref } from 'vue';
import { InterfaceBanner, TypeApiBlogCategoryI, TypeApiSettingI } from '~@/api/apiTypes';
import {getBannersApi} from '~@/api/banner.ts'
import { getBlogsApi ,getBlogCategories,getBlog,postComment,getComments} from '~@/api/blog';
import { apiGetSettings } from '~@/api/settings';




const bannerRepRef=ref<InterfaceBanner[]>([]);
const blogRepRef=ref();
const blogCategoriesRef=ref<TypeApiBlogCategoryI[]>();
const settingRef=ref<TypeApiSettingI>();





onMounted(async ()=>{
   
    const bannerData=await getBannersApi();
    console.log('data',bannerData);
    bannerRepRef.value=bannerData;


    const blogData=await getBlogsApi();
    console.log('blogData',blogData);
    blogRepRef.value=blogData;

    const blogCategories=await getBlogCategories();
    console.log('blogCategories',blogCategories);
    blogCategoriesRef.value=blogCategories;

    let data:any=await getBlog(1);
    console.log('getBlog()',data);
    //@ts-expect-error
    data=await postComment({id:'1'});
    console.log('postComment()',data);

    data=await getComments(1);
    console.log('getComments()',data);

    data=await apiGetSettings();
    console.log('apiGetSettings()',data);
})



// 

    ////#region defineXxx
    //defineOptions({
        //name:
    //});

    //const props=defineProps({
        //propA:{
            //type:String,
            //required:true
        //},
        //propB:{
            //type:Number,
            //default:1
        //},
        //propC:{
            //type:String as PropType<MyType>,
            //required:true
        //},
    //});

    //const emit = defineEmits<{
        //event1:[para1:number,para2:string],
        //event2:[para1:number,para2:string],
    //}>();
    ////#endregion
    
    
</script>
<style lang='less' scoped>
    
</style>